<template>
  <ele-form
    :isShowResetBtn="true"
    :isShowBackBtn="false"
    :isShowCancelBtn="false"
    :isLoading="isLoading"
    :formDesc="formDesc"
    v-model="formData"
    :request-fn="handleRequest"
    @request-success="$emit('request-success')"
  ></ele-form>
</template>

<script>
import { likeName } from "@/api/dept";
import { userPut } from "@/api/user";
import { confirmPassword } from "@/utils/validate";

export default {
  data() {
    var confirmPwd = (rule, value, callback) => {
      confirmPassword(value, callback, this.formData);
    };
    return {
      wraps: {
        deptItem: {}
      },
      isLoading: false,
      formData: {},
      formDesc: {
        userName: {
          type: "input",
          label: "昵称",
          layout: 12,
          required: true,
          isShowLabel: true
        },
        userLogin: {
          type: "input",
          label: "登录名",
          layout: 12,
          required: true,
          attrs: {
            type: "",
            min: 10
          }
        },
        userPhone: {
          label: "手机号",
          type: "input",
          required: true,
          layout: 12,
          rules: [
            {
              pattern: "(?:0|86|\\+86)?1[3456789]\\d{9}",
              type: "string",
              trigger: "blur",
              message: "请输入正确的手机号"
            }
          ]
        },
        userDeptId: {
          label: "部门",
          type: "autocomplete",
          attrs: {
            highlightFirstItem: true,
            suffixIcon: "el-icon-edit el-input__icon",
            fetchSuggestions: (queryString, cb) => {
              return this.querySearch(queryString, cb);
            }
          },
          layout: 12,
          required: true,
          on: {
            select: item => {
              this.wraps.deptItem = item;
            }
          }
        },
        userPassword: {
          label: "密码",
          type: "password",
          attrs: {
            maxlength: 18,
            minlength: 6
          },
          required: true,
          rules: [
            {
              pattern: "[a-zA-Z]\\w{5,17}",
              type: "string",
              trigger: "blur",
              message:
                "密码(以字母开头，长度在6~18之间，只能包含字母、数字和下划线)"
            }
          ],
          layout: 12
        },
        confirmPassword: {
          label: "确认密码",
          type: "password",
          layout: 12,
          required: true,
          rules: [
            {
              validator: confirmPwd,
              trigger: "blur"
            }
          ]
        },
        userHead: {
          label: "头像",
          type: "image-uploader",
          attrs: {
            size: 70,
            corp: false,
            fileSize: 0.3,
            data: { image: "PUBLIC_IMAGE" }
          }
        }
      }
    };
  },
  methods: {
    handleRequest(data) {
      // if (this.isLoading) {
      //   return;
      // }
      // this.isLoading = true;
      // data.userDeptId = this.wraps.deptItem.key;
      // return userPut(data)
      //   .then(response => {
      //     this.isLoading = false;
      //     return Promise.resolve(response);
      //   })
      //   .catch(error => {
      //     this.isLoading = false;
      //     return Promise.reject(error);
      //   });
      return Promise.resolve();
    },
    querySearch(queryString, cb) {
      likeName(queryString).then(response => {
        cb(response.data);
      });
    }
  }
};
</script>
